<xsl:stylesheet version="1.1"
                xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
                xmlns:xlink="http://www.w3.org/1999/xlink"
                xmlns="http://www.w3.org/2000/svg">
  <xsl:import href="../stylesheet.xslt"/>
  
  <xsl:include href="rotate.xslt"/>
  <xsl:include href="dig.xslt"/>
  
  <xsl:param name="width" select="480"/>
  <xsl:param name="height" select="320"/>                
  <xsl:param name="cx" select="$width div 2"/>
  <xsl:param name="cy" select="$height div 2"/>
  <xsl:param name="transition-dur" select="1"/>
  <xsl:param name="max-dur" select="60"/>
  <xsl:param name="quick-transition-dur" select="0.5"/>
                
  <xsl:template match="/"> 
  
    <xsl:call-template name="output-stylesheet-declaration"/>
   
    <svg>
      <xsl:variable name="x" select="-$cx"/>
      <xsl:variable name="y" select="-$cy"/>
      
      <xsl:attribute name="width"><xsl:value-of select="$width"/>px</xsl:attribute>
      <xsl:attribute name="height"><xsl:value-of select="$height"/>px</xsl:attribute>
      
      <xsl:attribute name="viewBox">
        <xsl:value-of select="$x"/>
        <xsl:text> </xsl:text>
        <xsl:value-of select="$y"/>
        <xsl:text> </xsl:text>
        <xsl:value-of select="$width"/>
        <xsl:text> </xsl:text>
        <xsl:value-of select="$height"/>
      </xsl:attribute>
      
      <xsl:apply-templates select="interactions" mode="output-defs"/>
      
      <xsl:apply-templates select="interactions"/>
      
    </svg>  
    
  </xsl:template>
  
  <xsl:template match="interactions" mode="output-defs">
	<defs>
	  <filter id="pop-filter" filterUnits="objectBoundingBox" x="-0.5"
			y="-0.5" width="2" height="2">
		<desc>Produces a 3D lighting effect.</desc>
		<feGaussianBlur in="SourceAlpha" stdDeviation="3"
				result="blur" />
		<feOffset in="blur" dx="0" dy="0" result="offsetBlur" />
		<feSpecularLighting in="blur" surfaceScale="5"
				specularConstant=".75" specularExponent="20" lighting-color="#bbbbbb"
				result="specOut">
		  <fePointLight x="-5000" y="-10000" z="20000" />
		</feSpecularLighting>
		<feComposite in="specOut" in2="SourceAlpha" operator="in"
				result="specOut" />
		<feComposite in="SourceGraphic" in2="specOut" operator="arithmetic"
				k1="0" k2="1" k3="1" k4="0" result="litPaint" />
		<feMerge>
		  <feMergeNode in="litPaint" />
		</feMerge>
	  </filter>
	  <filter id="push-filter" filterUnits="objectBoundingBox" x="-0.5"
			y="-0.5" width="2" height="2">
		<desc>Produces a 3D lighting effect.</desc>
		<feGaussianBlur in="SourceAlpha" stdDeviation="3"
				result="blur" />
		<feOffset in="blur" dx="0" dy="0" result="offsetBlur" />
		<feSpecularLighting in="blur" surfaceScale="5"
				specularConstant=".75" specularExponent="20" lighting-color="#bbbbbb"
				result="specOut">
		  <fePointLight x="5000" y="10000" z="20000" />
		</feSpecularLighting>
		<feComposite in="specOut" in2="SourceAlpha" operator="in"
				result="specOut" />
		<feComposite in="SourceGraphic" in2="specOut" operator="arithmetic"
				k1="0" k2="1" k3="1" k4="0" result="litPaint" />
		<feMerge>
		  <feMergeNode in="litPaint" />
		</feMerge>
      </filter>
      <xsl:apply-templates select="interaction" mode="defs"/>
	</defs>
  </xsl:template>
  
  <xsl:template match="interaction" mode="defs">
    <pattern patternUnits="userSpaceOnUse"
             x="-30" y="-30" width="60" height="60"
             viewBox="-30 -30 60 60" >
      <xsl:attribute name="id"><xsl:text>bg_</xsl:text><xsl:value-of select="@id"/></xsl:attribute>
      <rect x="-30" y="-30" width="60" height="60" class="menu-background"/>
      <xsl:apply-templates select="." mode="output-defs"/>
	</pattern>
    <pattern patternUnits="userSpaceOnUse"
             x="-30" y="-30" width="60" height="60"
             viewBox="-30 -30 60 60" >
      <xsl:attribute name="id"><xsl:text>bg_</xsl:text><xsl:value-of select="@id"/><xsl:text>_back</xsl:text></xsl:attribute>
      <rect x="-30" y="-30" width="60" height="60" class="menu-background"/>
      <xsl:apply-templates select="." mode="output-defs"/>
      <polygon points="-7,0 7,7 7,-7" fill="black" opacity="0.7" transform="translate(-2,0)"/>
	</pattern>
    <xsl:apply-templates select="children/interaction" mode="defs"/>
  </xsl:template>
  
  <xsl:template match="interaction" mode="output-defs" priority="-1">
	<text x="0" y="2" text-anchor="middle" class="menu-text">
      <xsl:value-of select="@name" />
	</text>
  </xsl:template>
  
  <xsl:template match="interactions|children">
    <xsl:param name="parent-id" select="../@id"/>
    <g opacity="0">
      <xsl:choose>
        <xsl:when test="name(.) = 'interactions'">

        </xsl:when>
        <xsl:when test="count(interaction) != 0">
          <xsl:attribute name="transform">
            <xsl:text>translate(</xsl:text>
            <xsl:value-of select="-$width"/>
            <xsl:text>,0)</xsl:text>
          </xsl:attribute>        
          <animateMotion from="0,0" fill="freeze" additive="replace">
            <xsl:attribute name="dur"><xsl:value-of select="$quick-transition-dur"/></xsl:attribute>
            <xsl:attribute name="to"><xsl:value-of select="$width"/><xsl:text>,0</xsl:text></xsl:attribute>
            <xsl:attribute name="begin"><xsl:text>circle_</xsl:text><xsl:value-of select="../@id"/><xsl:text>.click</xsl:text></xsl:attribute>
          </animateMotion>
          <animate attributeName="opacity" from="0" to="1" fill="freeze" additive="replace">
            <xsl:attribute name="dur"><xsl:value-of select="$transition-dur"/></xsl:attribute>
            <xsl:attribute name="begin"><xsl:text>circle_</xsl:text><xsl:value-of select="../@id"/><xsl:text>.click</xsl:text></xsl:attribute>
          </animate>
          <!-- animate backing out too -->
          <animateMotion to="0,0" fill="freeze" additive="replace">
            <xsl:attribute name="dur"><xsl:value-of select="$quick-transition-dur"/></xsl:attribute>          
            <xsl:attribute name="from"><xsl:value-of select="$width"/><xsl:text>,0</xsl:text></xsl:attribute>
            <xsl:attribute name="begin"><xsl:text>circle_</xsl:text><xsl:value-of select="../@id"/><xsl:text>_back.click</xsl:text></xsl:attribute>
          </animateMotion>
          <animate attributeName="opacity" from="1" to="0" fill="freeze" additive="replace">
            <xsl:attribute name="dur"><xsl:value-of select="$transition-dur"/></xsl:attribute>          
            <xsl:attribute name="begin"><xsl:text>circle_</xsl:text><xsl:value-of select="../@id"/><xsl:text>_back.click</xsl:text></xsl:attribute>
          </animate>
        </xsl:when>
      </xsl:choose>
      <xsl:variable name="child-count" select="count(interaction)"/>
      <xsl:for-each select="interaction">
        <xsl:variable name="position" select="position()"/>
        <xsl:variable name="angle" select="((360 * $position) div $child-count) - 90"/>
        <g filter="url(#pop-filter)">
	      <g>
	        <xsl:attribute name="transform">
	          <xsl:text>rotate(</xsl:text><xsl:value-of select="$angle"/><xsl:text>)</xsl:text>
	        </xsl:attribute>
		    <g transform="translate(-50,0)">
		      <xsl:choose>
		        <xsl:when test="count(children/interaction) != 0">
		          <xsl:apply-templates select=".">
		            <xsl:with-param name="angle" select="$angle"/>
		          </xsl:apply-templates>
		        </xsl:when>
		        <xsl:otherwise>
		          <a>
		            <xsl:attribute name="xlink:href"><xsl:text>i:</xsl:text><xsl:value-of select="@id"/></xsl:attribute>
		            <xsl:apply-templates select=".">
		              <xsl:with-param name="angle" select="$angle"/>
		            </xsl:apply-templates>
			      </a>
		        </xsl:otherwise>
			  </xsl:choose>
		    </g>
	      </g>
	      <set attributeName="filter" to="url(#push-filter)" begin="mousedown"
		      end="mouseup" />
	      <set attributeName="filter" to="url(#pop-filter)" begin="mouseout" />	    
        </g>
		<xsl:if test="count(children/interaction) != 0">
          <animateMotion from="0,0" fill="freeze" additive="replace">
            <xsl:attribute name="dur"><xsl:value-of select="$quick-transition-dur"/></xsl:attribute>          
            <xsl:attribute name="to"><xsl:value-of select="$width"/><xsl:text>,0</xsl:text></xsl:attribute>
            <xsl:attribute name="begin"><xsl:text>circle_</xsl:text><xsl:value-of select="@id"/><xsl:text>.click</xsl:text></xsl:attribute>
          </animateMotion>
          <animate attributeName="opacity" from="1" to="0" fill="freeze" additive="replace">
            <xsl:attribute name="dur"><xsl:value-of select="$transition-dur"/></xsl:attribute>          
            <xsl:attribute name="begin"><xsl:text>circle_</xsl:text><xsl:value-of select="@id"/><xsl:text>.click</xsl:text></xsl:attribute>
          </animate>		  
          <!-- animate backing out too -->
          <animateMotion to="0,0" fill="freeze" additive="replace">
            <xsl:attribute name="dur"><xsl:value-of select="$quick-transition-dur"/></xsl:attribute>          
            <xsl:attribute name="from"><xsl:value-of select="$width"/><xsl:text>,0</xsl:text></xsl:attribute>
            <xsl:attribute name="begin"><xsl:text>circle_</xsl:text><xsl:value-of select="@id"/><xsl:text>_back.click</xsl:text></xsl:attribute>
          </animateMotion>
          <animate attributeName="opacity" from="0" to="1" fill="freeze" additive="replace">
            <xsl:attribute name="dur"><xsl:value-of select="$transition-dur"/></xsl:attribute>          
            <xsl:attribute name="begin"><xsl:text>circle_</xsl:text><xsl:value-of select="@id"/><xsl:text>_back.click</xsl:text></xsl:attribute>
          </animate>          
          
		</xsl:if>
      </xsl:for-each>
      <xsl:choose>
        <xsl:when test="name(.) = 'interactions'">
	      <animate attributeName="opacity" attributeType="XML"
					  from="0" to="1" begin="0" dur="0.2s" fill="freeze"
					  additive="replace" >
            <xsl:attribute name="dur"><xsl:value-of select="$quick-transition-dur"/></xsl:attribute>
		  </animate>				    
      
        </xsl:when>
        <xsl:when test="count(interaction) != 0">
          <g filter="url(#pop-filter)">
            <xsl:apply-templates select="..">
              <xsl:with-param name="back" select="true()"/>
            </xsl:apply-templates>
          </g>
        </xsl:when>
      </xsl:choose>
    </g>
    <xsl:apply-templates select="interaction/children"/>
  </xsl:template>                
  
  <xsl:template match="interaction">
    <xsl:param name="angle">0</xsl:param>
    <xsl:param name="back" select="false()"/>
	<xsl:variable name="circle-id">
		<xsl:text>circle_</xsl:text><xsl:value-of select="@id"/>
		<xsl:if test="$back">
		  <xsl:text>_back</xsl:text>
		</xsl:if>
	</xsl:variable>
	<g opacity="0.5">
		<circle cx="0" cy="0" r="20" stroke="gray" class="menu-circle">
			<xsl:attribute name="id"><xsl:value-of select="$circle-id" /></xsl:attribute>
			<xsl:attribute name="transform"><xsl:text>rotate(</xsl:text><xsl:value-of
				select="-$angle" /><xsl:text>)</xsl:text></xsl:attribute>
			
			<xsl:attribute name="fill">
			  <xsl:text>url(#bg_</xsl:text>
			  <xsl:value-of select="@id"/>
			  <xsl:if test="$back">
			    <xsl:text>_back</xsl:text>
			  </xsl:if>
			  <xsl:text>)</xsl:text>
			</xsl:attribute>
			<animate attributeName="stroke" attributeType="XML" from="gray"
				to="yellow" begin="mouseover" end="mouseout" fill="freeze"
				additive="replace">
              <xsl:attribute name="dur"><xsl:value-of select="$transition-dur"/></xsl:attribute>			
			</animate>
			<animate attributeName="stroke" attributeType="XML" from="yellow"
				to="gray" begin="mouseout" dur="0.3s" fill="freeze" additive="replace" />
			<animate attributeName="r" from="20" to="25" dur="0.3s" begin="mouseover" additive="replace" fill="freeze"/>
			<animate attributeName="r" from="25" to="20" dur="0.3s" begin="mouseout" additive="replace" fill="freeze"/>
			<!-- 
			<animateTransform attributeName="transform"
				attributeType="XML" type="scale" begin="mouseover" dur="10s"
				values="1;1.4 ;1.2 ;1.4;1.2 ;1.4;1.2 ;1.4;1.2 ;1.4;1.2 ;1.4;1.2 ;1.4;1.2 ;1.4;1.2 ;1.4;1.2 ;1.4;1.2 ;1"
				keyTimes="0;0.02;0.05;0.1;0.15;0.2;0.25;0.3;0.35;0.4;0.45;0.5;0.55;0.6;0.65;0.7;0.75;0.8;0.85;0.9;0.95;1"
				fill="freeze" additive="replace" />
			<animateTransform attributeName="transform"
				attributeType="XML" type="scale" dur="10s" values="1.4;1;1"
				keyTimes="0;0.02;1" begin="mouseout" fill="freeze" additive="replace" />

			 -->
		</circle>
		<xsl:variable name="circle-mouseover">
			<xsl:value-of select="$circle-id" />
			<xsl:text>.mouseover</xsl:text>
		</xsl:variable>
		<xsl:variable name="circle-mouseout">
			<xsl:value-of select="$circle-id" />
			<xsl:text>.mouseout</xsl:text>
		</xsl:variable>
		<animate attributeName="opacity" attributeType="XML" values="0.5;1;1" fill="freeze" additive="replace">
            <xsl:attribute name="keyTimes">0;<xsl:value-of select="$transition-dur div $max-dur"/>;1</xsl:attribute>	
            <xsl:attribute name="dur"><xsl:value-of select="$max-dur"/></xsl:attribute>		
			<xsl:attribute name="begin"><xsl:value-of select="$circle-mouseover" /></xsl:attribute>
			<xsl:attribute name="end"><xsl:value-of select="$circle-mouseout" /></xsl:attribute>
		</animate>
		<animate attributeName="opacity" attributeType="XML" from="1"
			to="0.5" begin="mouseout" fill="freeze" additive="replace">
            <xsl:attribute name="dur"><xsl:value-of select="$transition-dur"/></xsl:attribute>
		</animate>
	</g>
  
  </xsl:template>
  
  <xsl:template match="interaction" mode="background">
	<text x="0" y="0" text-anchor="middle" font-family="Verdana"
		font-size="10" fill="black">
		<xsl:value-of select="@name" />
	</text>  
  </xsl:template>
                
</xsl:stylesheet>